import employeesData from '@/api/constant/employees'
import moment from 'moment'
import store from '@/store'
let clickOutside = ''
export default {
  errorimg: {
    inserted(dom, obj) {
      // 当你的图片有src就是用自己的src，没有就使用默认图片
      // 如果图片报错即加载出现问题，就用指定头像
      dom.src = dom.src || obj.value || require('@/assets/common/head.jpg')
      // 这是一个监听，当图片出错了就会执行且结果一致存在
      dom.onerror = () => {
        // 图片加载出错时会执行，如果出错就给他一个默认图片
        dom.src = obj.value || require('@/assets/common/head.jpg')
      }
    },
    // 当指令所在组件有更新且更新完毕后执行
    componentUpdated(dom, obj) {
      dom.src = dom.src || obj.value || require('@/assets/common/head.jpg')
    }
  },
  formatType: {
    // 只调用一次即再dom元素插入到dom树时即标签渲染完成时
    inserted(dom, obj) {
      const result = employeesData.workingState.find(
        (item) => +item.id === +obj.value
      )
      dom.innerHTML = result ? result.value : '-'
    },
    // 组件更新完毕后执行
    componentUpdated(dom, obj) {
      const result = employeesData.workingState.find(
        (item) => +item.id === +obj.value
      )
      dom.innerHTML = result ? result.value : '-'
    }
  },
  // 作用：点击某个dom区域外做出一些事件处理
  clickOutside: {
    inserted(dom, obj) {
      clickOutside = (e) => {
        // 点击当前指令所在dom区域外才执行相应方法
        // 当前点击的dom是否属于指令所在dom内
        // 指令所在dom包含点击的dom  contains
        // console.log('clickOutside')
        // e.target就是当前点击的dom
        if (!dom.contains(e.target)) {
          obj.value()
        }
      }
      document.addEventListener('click', clickOutside)
    },
    unbind() {
      document.removeEventListener('click', clickOutside)
    }
  },
  // 处理时间
  formatTime: {
    inserted(dom, obj) {
      dom.innerHTML = moment(obj.value).format('YYYY-MM-DD')
    }
  },
  // 解决按钮的显示与隐藏
  btnControl: {
    inserted(dom, obj) {
      if (!store.state.user.userInfo.roles.points.includes(obj.value)) {
        dom.style.display = 'none'
      }
    }
  }
}
